<template>
  <el-menu
    :unique-opened="true"
    @select="menuClick"
    @open="menuOpen"
    :default-openeds="['0']"
    size="small"
    :collapse="false"
    active-text-color="#409EFF">
<!--    <el-menu-item index="all" style="padding-left: 0">-->
<!--      <i class='el-icon-folder-opened'/>&nbsp;-->
<!--      <span>全部</span>-->
<!--    </el-menu-item>-->
    <template v-for='menu of menus'>
      <menu_tree :key='menu.id' :menu='menu'/>
    </template>
  </el-menu>
</template>

<script>
// eslint-disable-next-line camelcase
import menu_tree from './item'

export default {
  name: 'index',
  props: {
    menus: {
      type: Array,
      // eslint-disable-next-line vue/require-valid-default-prop
      default: []
    },
    pitchOn: {
      type: Function
    }
  },
  components: {
    menu_tree
  },
  methods: {
    menuOpen (e) {
      // console.info('open菜单', e)
      this.pitchOn(e)
    },
    menuClose (e) {
      console.info('close菜单', e)
    },
    menuClick (e) {
      // console.info('click==菜单', e)
      this.pitchOn(e)
    }
  }
}
</script>

<style scoped>

</style>
